<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
	String user_name = (session
			.getValue("SPRING_SECURITY_LAST_USERNAME")).toString();
%>
<html>
	<head>
		<title>无功功率曲线</title>
		<link id=style href="../styles/theme/blue/frame.css" type="text/css"
			rel="stylesheet" />
		<style type="text/css">
.divLinechart {
	width: 100%;
	margin: 5px;
}
</style>
		<script type='text/javascript' src='../ajax-pushlet-client.js'></script>
		<script type='text/javascript' src='../js/jquery.js'></script>
		<script type='text/javascript'
			src='<%=request.getContextPath()%>/js/jquery.blockUI.js'></script>
		<script type="text/javascript"
			src="<%=request.getContextPath()%>/js/highcharts.js"></script>
		<script type="text/javascript"
			src="<%=request.getContextPath()%>/js/highChartsTheme.js"></script>
		<script type="text/javascript"
			src="<%=request.getContextPath()%>/scripts/curveCommon.js"></script>
		<script>
function onData(event){

	var reactivePowerData = event.get("reactivePowerData");
	if(event.get("pnfn") != "" && event.get("pnfn") != undefined && event.get("pnfn") == "0101100a") { // 处理无功功率曲线返回数据
    	$("#tReactivePowerData").val(reactivePowerData);
    }
    else if(event.get("pnfn") != "" && event.get("pnfn") != undefined && event.get("pnfn") == "0101200a") {// 处理A相无功功率曲线返回数据
    	$("#aReactivePowerData").val(reactivePowerData);
    }
    else if(event.get("pnfn") != "" && event.get("pnfn") != undefined && event.get("pnfn") == "0101400a") {// 处理B相无功功率曲线返回数据
    	$("#bReactivePowerData").val(reactivePowerData);
    }
    else if(event.get("pnfn") != "" && event.get("pnfn") != undefined && event.get("pnfn") == "0101800a") {// 处理C相无功功率曲线返回数据
    	$("#cReactivePowerData").val(reactivePowerData);
    }
    
    // 如果响应都返回后，根据数据绘制曲线图
    if ($("#tReactivePowerData").val() != "" && $("#aReactivePowerData").val() != "" && $("#bReactivePowerData").val() != "" && $("#cReactivePowerData").val() != "" && $("#tReactivePowerData").val() != undefined  && $("#aReactivePowerData").val() != undefined && $("#bReactivePowerData").val() != undefined && $("#cReactivePowerData").val() != undefined ) {
	    // 准备总、A、B、C相有功功率
	    var tReactivePowerDataArr = $("#tReactivePowerData").val().split(":");
	    var aReactivePowerDataArr = $("#aReactivePowerData").val().split(":");
	    var bReactivePowerDataArr = $("#bReactivePowerData").val().split(":");
	    var cReactivePowerDataArr = $("#cReactivePowerData").val().split(":");
	    var startTime = event.get("startTime");
		
		var tReactivePowerDataArrDouble = new Array();
		var aReactivePowerDataArrDouble = new Array();
		var bReactivePowerDataArrDouble = new Array();
		var cReactivePowerDataArrDouble = new Array();
		for (var i=0; i<aReactivePowerDataArr.length; i++) {
			tReactivePowerDataArrDouble[i] = parseFloat(tReactivePowerDataArr[i]);
			aReactivePowerDataArrDouble[i] = parseFloat(aReactivePowerDataArr[i]);
			bReactivePowerDataArrDouble[i] = parseFloat(bReactivePowerDataArr[i]);
			cReactivePowerDataArrDouble[i] = parseFloat(cReactivePowerDataArr[i]);
		}
		
		// 修正各曲线的最大值
		var tCorrectYAxisMax = correctYAxisMax(tReactivePowerDataArrDouble, 2/3);
		var aCorrectYAxisMax = correctYAxisMax(aReactivePowerDataArrDouble, 2/3);
		var bCorrectYAxisMax = correctYAxisMax(bReactivePowerDataArrDouble, 2/3);
		var cCorrectYAxisMax = correctYAxisMax(cReactivePowerDataArrDouble, 2/3);
		
		var maxVal = -999999999;
		maxVal = tCorrectYAxisMax > maxVal ? tCorrectYAxisMax : maxVal;
		maxVal = aCorrectYAxisMax > maxVal ? aCorrectYAxisMax : maxVal;
		maxVal = bCorrectYAxisMax > maxVal ? bCorrectYAxisMax : maxVal;
		maxVal = cCorrectYAxisMax > maxVal ? cCorrectYAxisMax : maxVal;
		maxVal = maxVal > 0 ? maxVal : 10;
		
		// 修正各曲线的最小值
		var tCorrectYAxisMin = correctYAxisMin(tReactivePowerDataArrDouble, 2/3);
		var aCorrectYAxisMin = correctYAxisMin(aReactivePowerDataArrDouble, 2/3);
		var bCorrectYAxisMin = correctYAxisMin(bReactivePowerDataArrDouble, 2/3);
		var cCorrectYAxisMin = correctYAxisMin(cReactivePowerDataArrDouble, 2/3);
		
		var minVal = 0;
		minVal = tCorrectYAxisMin < minVal ? tCorrectYAxisMin : minVal;
		minVal = aCorrectYAxisMin < minVal ? aCorrectYAxisMin : minVal;
		minVal = bCorrectYAxisMin < minVal ? bCorrectYAxisMin : minVal;
		minVal = cCorrectYAxisMin < minVal ? cCorrectYAxisMin : minVal;
		
		// 准备时间
		var time = new Array();
		time[0] = startTime;
		var date= new Date(Date.parse(startTime.replace(/-/g,   "/"))); 
		for (var i=1; i<aReactivePowerDataArr.length; i++) {
		
			var date2Minsec = date.getTime();
		
			var addFifteen = 1000 * 60 * 15;
			date2Minsec += addFifteen;
			date = new Date(date2Minsec);
			time[i]= date2Str(date);
		}
		
		// 创建折线图，生成后放置在id为container的div中
		titleText = "无功功率曲线";
		colors = fourPhaseColor;
		yAxisText = "无功功率(kvar)";
		unit = "kvar";
		seriesVal = [{
			name: '无功功率',
			data: tReactivePowerDataArrDouble
		}, {
			name: 'A相无功功率',
			data: aReactivePowerDataArrDouble
		}, {
			name: 'B相无功功率',
			data: bReactivePowerDataArrDouble
		},{
			name: 'C相无功功率',
			data: cReactivePowerDataArrDouble
		}];
		var container = parent.window.frames["lineChart"].document.getElementById("container");
		
		var chart = showChart(container, titleText, startTime, colors, time, yAxisText, maxVal, minVal, unit, seriesVal);
    }
}

// pushlet ajax开始，监听/source/reactivePower的报文
PL._init('<%=user_name%>');
PL.joinListen('/source/reactivePower');
</script>
	</head>
	<body style="overflow-y: hidden; overflow-x: hidden">
		<input type="hidden" name="tReactivePowerData" id="tReactivePowerData" />
		<input type="hidden" name="aReactivePowerData" id="aReactivePowerData" />
		<input type="hidden" name="bReactivePowerData" id="bReactivePowerData" />
		<input type="hidden" name="cReactivePowerData" id="cReactivePowerData" />
		<div class="divLinechart" id="container">
		</div>
	</body>
</html>
